<template>
<div class="container content-wraper">

  <mt-field label="姓名" placeholder="请输入姓名" v-model="name"></mt-field>
  <mt-field label="手机号" placeholder="请输入手机号" type="tel" v-model="mobile" :attr="{ maxlength: 11 }"></mt-field>
  <mt-field label="左" placeholder="请输入左眼度数" type="number" v-model="left"></mt-field>
  <mt-field label="右" placeholder="请输入右眼度数" type="number" v-model="right"></mt-field>
  <mt-field label="生日" placeholder="请输入生日" type="date" v-model="birthday"></mt-field>
  <div class="btn-wrapper">
    <p class="">
      <button class="button is-primary" @click="btnSubmit">提交</button>
    </p>
  </div>
</div>
</template>
<script>
import { Message } from 'element-ui';
import { Field } from 'mint-ui';

export default {
  data() {
    return {
      name: '',
      mobile: '',
      left: '',
      right: '',
      birthday: '',
    };
  },
  methods: {
    btnSubmit() {
      this.$http.post(this.$url.ADDCONSUMER, {
        name: this.name,
        mobile: this.mobile,
        left: this.left,
        right: this.right,
        birthday: this.birthday,
      }).then((response) => {
        if (response.data.rtnCode === '000') {
          Message({
            message: response.data.rtnMsg,
            type: 'success',
            duration: 2000,
          });
          setTimeout(() => {
            this.$router.push({ name: 'Intro' });
          }, 2000)
        } else {
          Message({
            message: response.data.rtnMsg,
            type: 'error',
            duration: 2000,
          });
        }
      }).catch((error) => {
        Message({
          message: '网络问题，请稍后再试',
          type: 'error',
          duration: 2000,
        });
      })
    },
  },
  components: {
    'mt-field': Field,
  },
};

</script>

<style lang="scss">
</style>
